<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
	<title>My Page</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="jquery.mobile-1.1.1.min.css" />
	<script src="jquery.min.js"></script>
	<script src="jquery.mobile-1.1.1.min.js"></script>

</head> 
<body> 

<div data-role="page" id="home"> 
  <div data-role="header"> 
    <h1>Lists Demo1</h1> 
  </div> 
  <div data-role="content"> 
    <h2 style="padding: 1em 0;">A list view</h2> 
    <ul data-role="listview" data-inset="true"> 
      <li>Cat</li> 
      <li>Dog</li> 
      <li>Mouse</li> 
      <li>Squirrel</li> 
    </ul> 
    <h2 style="padding: 1em 0;">A list of links</h2> 
    <ul data-role="listview" data-inset="true" data-filter="true"> 
      <li><a href="#">一号</a></li> 
      <li><a href="#">二号</a></li> 
      <li><a href="#">三号</a></li> 
    </ul> 
    <h2 style="padding: 1em 0;">Nested lists</h2> 
    <ul data-role="listview" data-inset="true"> 
      <li>Play  
        <ul> 
          <li><a href="#">Easy</a></li> 
          <li><a href="#">Medium</a></li> 
          <li><a href="#">Hard</a></li> 
        </ul> 
      </li> 
      <li>Settings  
        <ul> 
          <li><a href="#">Graphics</a></li> 
          <li><a href="#">Sound</a></li> 
          <li><a href="#">Device</a></li> 
        </ul> 
      </li> 
      <li>Highscores  
        <ul> 
          <li><a href="#">View</a></li> 
          <li><a href="#">Submit</a></li>
          <li><a href="#">Reset</a></li> 
        </ul> 
      </li> 
    </ul> 
    <h2 style="padding: 1em 0;">A split button list with filter</h2> 
    <ul data-role="listview" data-inset="true" data-filter="true"> 
      <li> 
        <a href="#">The Grapes of Wrath</a> 
        <a href="#">Buy This Book</a> 
      </li> 
      <li> 
        <a href="#">The Trial</a> 
        <a href="#">Buy This Book</a> 
      </li> 
      <li> 
        <a href="#">A Tale of Two Cities</a> 
        <a href="#">Buy This Book</a> 
      </li>        
    </ul> 
    <h2 style="padding: 1em 0;">A list with count bubbles</h2> 
    <ul data-role="listview" data-inset="true"> 
      <li><a href="#">SuperWidgets</a> <span class="ui-li-count">14</span></li> 
      <li><a href="#">MegaWidgets</a> <span class="ui-li-count">0</span></li> 
      <li><a href="#">WonderWidgets</a> <span class="ui-li-count">327</span></li>        
    </ul> 
  </div>
  <div style="height:500px;">
    
  </div>
  <div style="height:50px;width:50px;background:#999;\position:fixed;left:0;bottom:0;"></div>
</div>

</body>
</html>